<%@ page contentType="text/html; charset=UTF-8" language="java" pageEncoding="UTF-8"%>
<%@include file="/common/taglibs.jsp"%>
<%@include file="/common/javascript.jsp" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>系统选项</title>
    <script type="text/javascript">
    var mainform;
    var grid;
    var viewType = "${viewType}";
    var langTypes;
    var toolbarOptions = {
            items: [
                { text: '增加', click: itemclick , img:"${ctx}/static/icons/silkicons/add.png"},
                { line:true },
                { text: '修改', click: itemclick, img: "${ctx}/static/icons/miniicons/page_edit.gif" },
                { line: true },
                { text: '保存', click: itemclick, img: "${ctx}/static/icons/silkicons/page_save.png" },
                { line: true },
                { text: '取消', click: itemclick, img: "${ctx}/static/icons/silkicons/cancel.png" },
                { line: true },
                { text: '删除', click: itemclick, img: "${ctx}/static/icons/miniicons/page_delete.gif" }
            ]
        };
    $(function (){
    	$.ajax({
    		   type: "POST",
    		   url: "${ctx}/common/getLangTypes",
    		   async:false,
    		   success: function(result){
    		     if(typeof(result)=="string"){
    		    	 result=eval("("+result+")");
    		     }
    		     langTypes=result;
    		   }
    	});

        $.validator.addMethod(
                "uniqueTabD",
                function (value, element, regexp)
                {
                    if (!value) {
                    	return true;
                    }
                    var data=grid.getData();
                    //alert(JSON2.stringify(data));
                    for(var i=0;i<data.length;i++){
                    	if($.trim(value)==data[i].tdId && !data[i]._editing){
                    		return false;
                    	}
                    }
                    return !$(element).hasClass("l-text-field-null");
                },
                "必须唯一"
        );
        
    	$("#tabcontainer").ligerTab();

        mainform=$("#mainform");

        mainform.ligerForm();

        if(viewType=="modify"){
        	 $("#thId").attr("readonly", "readonly").removeAttr("validate");
        }

        if(viewType=="detail"){
        	$("input,select,textarea",mainform).attr("readonly", "readonly");
        	toolbarOptions=null;
        }else{
            $.metadata.setType("attr", "validate");
            LG.validate(mainform);
            
            LG.validate($("#tabDform"), { debug: true });
        }

        $("#maingrid").ligerGrid({
            columns: [
            { display: '选项值',name: 'tdId',validate:{ required: true,uniqueTabD:true },editor:{ type: 'text' },align: 'left', width:'15%', minWidth: 60},
            { display: '定义', name: 'tdName',validate:{ required: true },editor:{ type: 'text' },width:'15%',minWidth: 120 },
            { display: '排序值', name: 'tdOrd',validate:{ required: true,digits:true},editor:{ type: 'text' },width:'10%',minWidth: 120,type:'int'},
            { display: '启用', width:'10%', name: 'isEnable',minWidth: 120,
    			editor:{type:'chk',ext:function (rowData,rowIndex,item,column){
                        return {
                            render: function ()
                            {
                            	if (item.isEnable=='F'){
                                	return '<input type="checkbox" name="isEnable" onclick="updateTNF(\''+rowIndex+'\',this.checked)" value="F"/>';
                                }
                                return '<input type="checkbox" name="isEnable" checked="checked" onclick="updateTNF(\''+rowIndex+'\',this.checked)" value="T"/>';
                            }
                        };
                    }
    			},
                render: function (item,rowIndex)
                {
                    if (item.isEnable=='F'){
                    	return '<input type="checkbox" name="isEnable" onclick="updateTNF(\''+rowIndex+'\',this.checked)" value="F"/>';
                    }
                    return '<input type="checkbox" name="isEnable" checked="checked" onclick="updateTNF(\''+rowIndex+'\',this.checked)" value="T"/>';
                }
            },
            { display: '语言',name: 'langType',width:"20%", minWidth:120,type:'string',
                editor: { type: 'select', data: langTypes, valueColumnName: 'tdId', displayColumnName: 'tdName'}, 
                render: function (item)
                {
                    for (var i = 0; i < langTypes.length; i++)
                    {
                        if (langTypes[i]['thId'] == item.langType){
                        	return langTypes[i]['tdId'];
                        }
                    }
                    return item.langType;
                }
            },
            { display: '备注', name: 'remark',editor:{ type: 'text' }, width:'30%',minWidth: 200 }
            ],
            dataAction: 'server',url: '${ctx}/systab/tdList?thId=${command.thId}', pageSize: 20, toolbar: toolbarOptions, sortName: 'tdOrd',
            width: '98%', height: '100%', heightDiff: -5, checkbox: false, usePager: false, enabledEdit: true, clickToEdit: false,
            fixedCellHeight: true, rowHeight: 25,onAfterBeginEdit:f_afterBeginEdit
        });
        
        grid = $("#maingrid").ligerGetGridManager();

        grid.bind('beforeSubmitEdit', function (e){
        	if (!LG.validator.form()){
        		LG.showInvalid();
        	    	return false;
        	 	}
        	return true;
       	});
        
        $("#pageloading").hide();
        
        LG.setFormDefaultBtn(cancel,viewType=="detail" ? null : save);

    });
   
    
    function updateTNF(rowIndex,checked){
    	 var row=grid.getRow(rowIndex);
    	 row.isEnable=checked?"T":"F";
    	 //grid.updateRow(row,rowIndex);
    	 //grid.updateCell("isEnable", checked?"T":"F",row);
    }
   
    function itemclick(item){
        var editingrow = grid.getEditingRow();
        switch (item.text)
        {
            case "增加":
                if (editingrow == null)
                {
                    addNewRow();
                } else
                {
                    LG.tip('请先保存或取消修改');
                }
                break;
            case "修改":
                if (editingrow == null)
                {
                    beginEdit();
                } else
                {
                    LG.tip('请先保存或取消修改');
                }
                break;
            case "保存":
                if (editingrow != null)
                {
                    grid.endEdit(editingrow);
                } else
                {
                    LG.tip('非编辑状态!');
                }
                break;
            case "取消":
                if (editingrow != null)
                {
                    grid.cancelEdit(editingrow); 
                } else
                {
                    LG.tip('非编辑状态!');
                }
                break;
            case "删除": 
                $.ligerDialog.confirm('确定删除吗?', function (confirm) {
                    if (confirm)
                    	var selected = grid.getSelected();
	                    if (selected)
	                    {
	                    	 grid.remove(selected);
	                    }
                });
                break;
        }
    }
    
   
    
    function beginEdit()
    {
        var row = grid.getSelectedRow();
        if (!row) { LG.tip('请选择行'); return; }
        grid.beginEdit(row); 
    }
    function addNewRow()
    {
        grid.addEditRow({langType:langTypes[0]['thId']});
    }
    
    
    function f_afterBeginEdit(e){

    	var row=grid.getRowObj(e.rowindex);
    	
    	var td=$(row.firstElementChild);
    	
    	var record=e["record"];
		
    	if(record["__status"]!="add"){
    		
    		td.find("input:first").attr("readonly","readonly");
    	}
    }
    
    
    function save(){
    	var editingrow = grid.getEditingRow();
        if (editingrow != null){
        	LG.tip('请先保存或取消修改');
        	return;
        }
    	var data = grid.getData();
    	$("#tabJsonValues").val(JSON.stringify(data));
        LG.submitForm(mainform, function (result) {
        	if(typeof(result)=="string"){
        		result=eval("("+result+")");
        	}
            if (!result.success) {
                LG.showError('错误:' + data.message);
            }
            else { 
                LG.showSuccess('保存成功', function () { 
                   LG.callParent("systabList");
                });
            }
        });
    }
    function cancel(){
        var win = window.parent || window;
        if(win.dialog){
        	win.dialog.close();
        }
    }
 </script>
</head>

<body>
<div id="tabcontainer" style="margin:0px;">
    <div title="基本信息" tabid="tab_tabH">
    <form name="mainform" method="post"  id="mainform" action="${ctx}/systab/save">
        <input type="hidden" name="viewType" value="${viewType}"/>
        <input type="hidden" name="tabJsonValues" id="tabJsonValues"/>
        <table cellpadding="0" cellspacing="0" class="l-table-edit" style="width: 100%;">
            <tr>
                <td align="left" class="l-table-edit-td">代码:</td>
                <td align="left" class="l-table-edit-td" colspan="4">
                	<input name="thId" type="text" id="thId" value="${command.thId }" ltype="text" validate="{required:true,maxlength:36}"/>
                </td>
                <td align="left"></td>
            </tr>
            <tr>
                <td align="left" class="l-table-edit-td" valign="top">定义:</td>
                <td align="left" class="l-table-edit-td" colspan="4">
                	<input name="thName" type="text" id="thName" value="${command.thName }" ltype="text" validate="{required:true,maxlength:100}"/>
                </td>
                <td align="left"></td>
            </tr>
            <tr>
                <td align="left" class="l-table-edit-td" valign="top">代码长度:</td>
                <td align="left" class="l-table-edit-td" colspan="4">
                	<input name="thWidth" type="text" id="thWidth" value="${command.thWidth }" ltype="text" validate="{required:true,digits:true,min:1,max:100}"/>
                </td>
                <td align="left"></td>
            </tr>
             <tr>
                <td align="left" class="l-table-edit-td" valign="top">启用:</td>
                <td align="left" class="l-table-edit-td" style="width:160px">
                	<c:choose>
                		<c:when test="${command.isEnable eq 'F' }">
                			<input id="isEnable" type="checkbox" name="isEnable" value="F" onchange="changeTnf(this)"/> 
                		</c:when>
                		<c:otherwise>
                			<input id="isEnable" type="checkbox" name="isEnable" value="T" checked="checked"  onchange="changeTnf(this)"/> 
                		</c:otherwise>
                	</c:choose>
                </td>
                <td align="left"></td>
            </tr>
            <tr>
                <td align="left" class="l-table-edit-td">备注:</td>
                <td align="left" class="l-table-edit-td" colspan="4"> 
                <textarea cols="100" rows="3" class="l-textarea" id="remark" name="remark" style="width:400px">${command.remark}</textarea>
                </td> <td align="left"></td>
           </tr>
           
           <tr>
                <td align="left" class="l-table-edit-td" valign="top">建档人:</td>
                <td align="left" class="l-table-edit-td" style="width:160px">${command.userCre }</td>
                <td align="left"></td>
                
                <td align="left" class="l-table-edit-td" valign="top">修改人:</td>
                <td align="left" class="l-table-edit-td" style="width:160px">${command.userUpd }</td>
                <td align="left"></td>
           </tr>
        </table>
    </form>
    </div>
  <div title="选项值" tabid="tab_tabD">
  		<form id="tabDform">
		<div id="maingrid" style="height:300px;width:100%;margin:0; padding:0"></div>
		</form>
  </div>
  </div>
</body>
</html>
